<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta content="width=device-width" name="viewport" />
        <style>
            body {
                margin: 0;
                padding: 0;
                font-family: Arial, Helvetica, sans-serif;
                font-size: 12px;
                background-color: #f0f0f0;
            }

            .email-wrap {
                width: 100%;
                height: 100vh;
                background: #f0f0f0;
            }

            .main-wrap {
                width: 600px;
                height: 100%;
                margin: 0 auto;
                background: #ffffff;
            }

            .top-img {
                display: flex;
                padding: 7px 15px;
            }

            .top-img .image {
                width: 100%;
            }

            .inner-text {
                padding: 30px 40px 0 50px;
            }

            .text-wrap {
                font-family: Arial, verdana;
                font-size: 12px;
                color: #000000;
                line-height: 13pt;
                text-align: left;
                margin-bottom: 20px;
            }
        </style>
    </head>
    <body>
        <div class="email-wrap">
            <div class="main-wrap">
                <div class="top-img">
                    <details>
                        <summary>可见部分由summary控制</summary>
                        <p>隐藏部分1</p>
                        <p>隐藏部分2</p>
                    </details>
                </div>
                <div class="inner-text">
                    <div class="text-wrap">亲爱的 {{UserName}},</div>
                    <div class="text-wrap">
                        我们注意到您的设备电量不足，
                        可能影响设备的正常使用。
                        请尽快更换电池或充电
                        防止意外关机。
                    </div>
                    <!--<div class="text-wrap">-->
                    {{UnitContent}}
                    <!--</div>-->
                    <div class="text-wrap">
                        请注意，电池耗尽可能
                        中断任何正在进行的工作或操作。以确保
                        您的设备是否正常运行，请
                        及时解决电池电量问题。
                    </div>
                    <div class="text-wrap">
                        感谢您的合作和理解。
                    </div>
                    <div class="text-wrap">
                        如果你有任何问题或需要帮助，请
                        请随时与我们联系。
                    </div>
                    <div class="text-wrap">Thank you!</div>
                    <div class="text-wrap">EliteSys</div>
                </div>
            </div>
        </div>
    </body>
</html>